<template>
  <div class="add">
    品牌名称:<input
      type="text"
      v-model="keyword"
      placeholder="请输入搜索条件"
    />
    <input type="button" value="搜索" />
  </div>
</template>
<script>
export default {
  props: {
    oldGoodsList: {
      type: Array,
    },
  },
  data() {
    return {
      keyword: "", //搜索关键字
    };
  },
  watch: {
    keyword(newVal) {
      //去oldGoodsList里面搜索  搜索到结束之后  重新给goodsList赋值
      console.log(newVal);
      console.log(this.oldGoodsList);

      //根据newval用户输入的搜索关键字去oldGoodsList中的每个对象中的productName这个字段中进行indexOf搜索  结合filter 返回搜索结果不等于-1的选项
      let result = this.oldGoodsList.filter(
        (item) => item.title.indexOf(newVal) !== -1)
        console.log(result)
      //将搜素结果传递给父组件
      this.$emit("search", result);
    },
  },
};
</script>